<template>
	<view class="popup-box">
		<view class="">
			<view class="cu-modal" :class="{ show: showModal }" @tap="hideModal()">
				<view class="cu-dialog" style="width: 610rpx;background: none;">
					<view class="img-box">
            <image class="modal-img" src="https://duomi.bigchun.com/images/youhuiquan.png" mode="aspectFit"></image>
            <image class="modal-img-get" @tap.stop="onPopup()" src="@/static/images/shouye/youhuiquanlingqu.png" mode="aspectFit"></image>
            <image class="modal-img-cloes"@tap="hideModal()" src="@/static/images/shouye/youhuiquanclose.png" mode="aspectFit"></image>
          </view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
/**
 * 广告模态框。连续弹窗和只弹一次。
 * @property {Object} newPopupList  - vuex 初始化传过来的数据
 */
import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
let timer = null;
export default {
	name: 'shoproNoticeModal',
	components: {},
	data() {
		return {
			popupCurrent: 0,
			showModal: true
		};
	},
	props: {},
	computed: {
		...mapGetters(['isLogin']),
	},
	beforeDestroy() {
		clearTimeout(timer);
		timer = null;
	},
	methods: {
		hideModal( index) {
			clearTimeout(timer);
			this.showModal = false;
			// timer = setTimeout(() => {
			// 	this.popupCurrent += 1;
			// 	this.showModal = true;
			// }, 500);
		},
		onPopup() {
      var that = this;
      that.$https( 'coupons.getyouhuiquan',
          {
            token: uni.getStorageSync("token"),
          }
      )
      .then(res => {
        if (res.code === 1) {
          clearTimeout(timer);
          timer = null;
          this.showModal = false;
          this.$u.toast(res.msg);
        }
      });
		}
	}
};
</script>

<style lang="scss">
.img-box {
	position: relative;
	width: 610rpx;
	.modal-img {
		width: 100%;
		will-change: transform;
		height: 560rpx;
	}
  .modal-img-get{
    width: 100%;
    will-change: transform;
    height: 80rpx;
  }
  .modal-img-cloes{
    position: absolute;
    top: 30rpx;
    right: -255rpx;
    width: 100%;
    height: 60rpx;
  }
}
</style>
